<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-RU">
<head profile="http://gmpg.org/xfn/11">

<?php 
require_once 'class/config.php';
$db = DataBase::getInstance();
$countryIdentifiers = $db->getCountriesIdentifiers();
$treatyDetails = $db->getTreatyDetails($_GET['treatyID']);
$treatyInfo = array();
foreach ($treatyDetails as $treaty){
  $treatyInfo[] = $treaty;
}
?>

	<title>
	<?php 
	foreach ($treatyDetails as $treatyDetail){
		echo $treatyDetail['title'];
		break;
	}
	?>
	</title>
	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.js"></script>
	<script type="text/javascript" src="js/jquery.svgworldmap-2.1.src.js"></script>
	<link type="text/css" rel="stylesheet" href="css/svgworldmap.css" />
  <link href="./css/style.css" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
  <script type="text/javascript">
    $(function() {
        $( "#slider-range-min" ).slider({
            range: "min",
            value: new Date().getFullYear(),
            min: 1950,
            max: new Date().getFullYear(),
            slide: function( event, ui ) {
                changeMapByYear(ui.value);
            }
        });
    });
		
  /* Country click handler */
  function countryclick(tld) {
    alert('Country clicked: '+tld);
  }
  
  function changeMapByYear(year){
    
    $.each(countryObject, function(index, value){
      var newIndex = value["countryIdentifier"];
      jsonObject.c[newIndex] = 1;
    });
    
    $.each(treatyObject, function(index, value){
      var countryIndex = value["countryIdentifier"];
      if ( value["signature"] != "0000-00-00") {
        if (value["signature"].substring(0, 4) <= year){
          jsonObject.c[countryIndex] = 3;
        }
      }
      else if ( value["ratification"] != "0000-00-00") {
        if (value["ratification"].substring(0, 4) <= year){
          jsonObject.c[countryIndex] = 4;
        }
      }
      
    });
    
    jQuery('#place').html('');
    jQuery('#place').SVGWorldMap(jsonObject);
  }

  jQuery(document).ready(function(){
    countryObject = <?php echo json_encode($countryIdentifiers); ?>;
    treatyObject = <?php echo json_encode($treatyInfo); ?>;
  
    jsonObject = {
      bottom : 20,
      clickhandler : 'countryclick',
      c : {
        RO : 3
      }
    }
    changeMapByYear(new Date().getFullYear());
  });

	</script>
	<style type="text/css">
/*	body {background:white;font-family:arial, sans-serif;font-size:12px;}*/
	div.lastlink {border-top:1px solid #e0e0e0;margin-top:10px;padding:10px;}
	</style>

</head>
<body>
<div id="container">
<div id="header"></div>
<div id="head">
</div>
<div id="content" style="background-color: blue">
  <div id="slider-range-min"></div>
	<!-- World map containter. Width and height can be set here -->
	<div id="place" style="width:1200px;height:740px;"></div>


	
</div>
<div id="footer"></div>
</div>
</body>
</html>